<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>3-4 Bootstrap中的表格</title>

    <link rel="stylesheet" href="./bootstrap-3.3.7/dist/css/bootstrap.min.css">
    <script src="jquery/jquery-3.4.1.min.js"></script>
    <script src="bootstrap-3.3.7/dist/js/bootstrap.min.js"></script>


</head>
<body>


<table class="table  table-striped table-bordered table-hover">

    <thead>

    <th>标题一</th>
    <th>标题二</th>
    <th>标题三</th>
    <th>标题四</th>
    <th>标题五</th>

    </thead>
    <tbody>
    <tr class="warning">
        <td>内容一</td>
        <td>内容二</td>
        <td>内容三</td>
        <td>内容四</td>
        <td>内容五</td>

    </tr>

    <tr class="danger">
        <td>内容一</td>
        <td>内容二</td>
        <td>内容三</td>
        <td>内容四</td>
        <td>内容五</td>
    </tr>

    <tr class="info">
        <td>内容一</td>
        <td>内容二</td>
        <td>内容三</td>
        <td>内容四</td>
        <td>内容五</td>
    </tr>

    <tr class="success">
        <td>内容一</td>
        <td>内容二</td>
        <td>内容三</td>
        <td>内容四</td>
        <td>内容五</td>
    </tr>

    <tr class="active">
        <td>内容一</td>
        <td>内容二</td>
        <td>内容三</td>
        <td>内容四</td>
        <td>内容五</td>
    </tr>


    </tbody>
</table>



</body>
</html>
